<template>
    <div class="mainDiv" style="padding: 10px; box-sizing: border-box;">
        <div class="rowHead">
            <el-input v-model="filter.keywords" placeholder="请输入关键字" class="searchArea" @keyup.enter.native="getmsg">
                <el-button slot="append" icon="search" type="primary" @click="getmsg">查找</el-button>
            </el-input>
        </div>
        <el-table :data="goodslist" height="100%" @row-click="selectRow" @row-dblclick="goback" :row-class-name="tableRowClassName">
            <el-table-column prop="selected" label="选择" width="100">
                <template slot-scope="scope">
                    <el-switch v-model="scope.row.selected"></el-switch>
                </template>
            </el-table-column>
            <el-table-column prop="name" label="姓名" width="180"></el-table-column>
            <el-table-column prop="worknum" label="员工工号"></el-table-column>
            <el-table-column prop="username" label="登陆账号"></el-table-column>
            <el-table-column prop="zcname" label="职位职称"></el-table-column>
            <el-table-column prop="isfw" label="是否当前顾客服务员">
                <template slot-scope="scope">
                    <el-tag :type="scope.row.isfw?'success':'danger'">
                        {{scope.row.isfw?'是':'否'}}
                    </el-tag>
                </template>
            </el-table-column>
        </el-table>
        <div class="rowHead">
            <el-col :span="12">
                <el-pagination @current-change="changecurrent" :current-page="filter.currentpage" layout="total, prev, pager, next" :total="total" :page-size="filter.pagesize">
                </el-pagination>
            </el-col>
            <el-col :span="12">
                <el-button style="float: right;margin-left: 5px" size="mini" type="success" icon="check" @click="goback">确定选择</el-button>
                <el-button style="float: right;" size="mini" type="danger" icon="close" @click="closeWindow">取消关闭</el-button>
            </el-col>
        </div>
    </div>
</template>
<script>
import C from '@/common/common.js'

export default {
  name: 'userPopup',
  data () {
    return {
      goodslist: [],
      total: 0,
      selectrow: {},
      isfw: [],
      filter: {
        pagesize: 30,
        isdisabled: 0,
        currentpage: 1,
        guestid: 0,
        keywords: ''
      }
    }
  },
  methods: {
    changecurrent: function (val) {
      this.filter.currentpage = val
      this.getmsg()
    },
    getmsg: async function () {
      let data = await C.ajax('/shop/popup/getappuser', { filter: JSON.stringify(this.filter), guestid: this.filter.guestid }, 'post')
      if (data) {
        for (var i = 0; i < data.list.length; i++) {
          if (data.aid.indexOf(data.list[i].id) != -1) {
            data.list[i].isfw = true
          } else {
            data.list[i].isfw = false
          }
        }
        this.total = data.count
        this.checkselect(data.list)
      }
    },
    selectRow: function (row, event, column) {
      event.preventDefault()
      this.selectrow = row
      this.checkselect(this.goodslist)
    },
    tableRowClassName: function (row, index) {
      if (row.selected) return 'info-row'
    },
    // 计算是否选择
    checkselect: function (data) {
      if (data.length > 0) {
        data.forEach((row, index) => {
          data[index].selected = row.id == this.selectrow.id
        })
        this.isfw.forEach((res) => {
          data.forEach((r) => {
            if (res === r.id) {
              r.isfw = 1
            }
          })
        })
        this.goodslist = data
      }
    },
    goback: function () {
      if (!this.selectrow.id) {
        C.error('请先选择行！')
        return false
      }
      C.closeBrowserWindow(this.selectrow)
    },
    closeWindow: function () {
      C.closewin()
    }
  },
  mounted: function () {
    let data = C.getDatas()
    if (data) {
      this.filter = data.filter
      if (data.data) {
        this.isfw = data.data.aid
        this.checkselect(data.data.list)
        this.total = data.data.count
      } else {
        this.getmsg()
      }
    } else {
      this.getmsg()
    }
  }
}
</script>